<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta name="viewport" content="user-scalable=no, initial-scale=1.0, maximum-scale=1.0 minimal-ui">
	<meta name="format-detection" content="telephone=no">
    <script src="${base }/static/js/jquery-2.1.4.min.js" type="text/javascript"></script>
	<!-- <link href="/css/success.css?{{rand(1,100)}}" rel="stylesheet" type="text/css"> -->
	<title>操作成功</title>
	<style>
        html, body{
        	padding: 0;
        	margin: 0;
        	width: 100%;
        	height: 90%;
        }
        body{
        	background:#23AC38;
        	font-family: Arial, Helvetica, Verdana;
        	line-height: 22px;
        	color: #666;
        	position: relative;
        	-webkit-text-size-adjust: none;/*取消浏览器最小字体限制*/
        }
        .content{
        	background: #FFFFFF;
        	width: 88%;
        	height:88%;
        	margin: 25px auto;
        	border-radius: 5px;
        	position: relative;
        }
        .head{
        	width:88%;
        	height: 9%;
        	position: absolute;
        	top: 3%;
        	left: 6%;
        	text-align: center;
        	color:#757575;
        	line-height: 200%;
        	font-size: 85%;
        	font-weight: bold;
        	border-bottom:1px dashed #CFCFCF;
        }
        .date_state{
        	position: absolute;
        	top: 17%;
        	width: 100%;
        	text-align: center;
            color:#42B651;
            height:9%;
            font-size: 80%;
            line-height: 200%;
            text-align: center;
        }
        .money{
        	position: absolute;
        	top: 26%;
        	width: 100%;
        	height: 9%;
        	color: #4A4A48;
        	font-size:90%;
            font-weight: bold;
            line-height: 150%;
            text-align: center;
            font-family: "Microsoft YaHei";
        }
        .number{
        	position:absolute;
        	top: 34%;
        	height: 7%;
        	width: 100%;
        	text-align: center;
        	font-size: 65%;
        	color:#B6B6B6;
        	line-height: 180%;
        }
        .complete{
            position: absolute;
            top:46%;
            left:37.5%;
            width: 25%;
            text-align: center;
            color: #42B651;
            height: 8%;
            border-radius: 3px;
            border:1px solid #42B651;
            line-height: 250%;
            font-size: 80%;
        }
        .follow{
        	position:absolute;
        	top:58%;
        	width: 88%;
        	left: 6%;
        	height: 9%;
        	text-align: center;
            font-size: 70%;
            line-height:50%; 
        	color: #717171;
        	border-bottom:1px dashed #CFCFCF;
        }
        .active{
        	position: absolute;
        	left: 30%;
        	top: 68%;
        	width: 40%;
        	height: 29%;
        }
        .active img{
            width: 100%;
            height:100%;
        }
        .footer{
            position:fixed;
            bottom:10px;
            width: 100%;
            height: 17px;
            text-align: center;
            line-height: 17px;
            font-size: 55%;
            color: #fff;
        }
	</style>
    <script type="text/javascript">
    // {% if type%}
    //   {%if type == 'wx'%}
       function closepage()
            {
                var follow = $("input[name='follow']").is(':checked');
                if(follow)
                {
                    var url = 'https://mp.weixin.qq.com/mp/profile_ext?action=home&__biz=MzI4Nzk3Mzc3Nw==&scene=124#wechat_redirect';
                    
                    window.location.href=url;
                    
                }else
                {
                    WeixinJSBridge.call('closeWindow');
                }
            }
    //   {%endif%}
    // {%endif%}
    </script>
</head>
<body>
  <div class="content">
  	<div class="head">中翰云油充值卡</div>
  	<div class="date_state">${myOrder.orderTime }&nbsp;&nbsp;充值成功,关注公众号,及时推送消息</div>
  	<div class="money">￥${myOrder.rechargeAmount}</div>
  	<div class="number">订单号&nbsp;&nbsp;${myOrder.orderNo }</div>

  	<div class="complete" onclick="closepage()">完&nbsp;成</div>
  	<div class="follow">长按识别二维码关注中翰云油公众号</div>

    <div class="active"><a href="/activity/newactivity"><img src="${base }/static/img/gasparty.jpg" alt="" style=""></a></div>
  </div>  

  <div class="footer">中翰云油&nbsp;&nbsp; 400-855-9598</div>
</body>
</html>